<template>
  <view class="">
    <uni-nav-bar @clickLeft="$ui.back()" dark color="#FFD76B" backgroundColor="#323232" background-color="#007AFF"
      left-icon="left" status-bar title="Dapp" />
    <view style="height:24px">

    </view>
    <view class="dapp" v-for="(item,index) in list" :key="index">
      <view class="image">

      </view>
      <view class="title">
        {{item.title}}
        <span style="color: red;"> 799人玩过</span>
      </view>
      <view class="content">
        {{item.content}}
      </view>
      <view class="button" @click="openUrl(item.path)">
        去玩
      </view>
    </view>
  </view>
</template>

<script>
  import {
    getTurntable
  } from '@/api/index.js'
  export default {
    data() {
      return {
        list: [{
          title: '幸运水果机',
          content: '玩水果机，赢取777奖池大奖',
          path: '/pages/mine/shake/shake',
        }, {
          title: '多人骰子',
          content: '多人骰子押宝 赢取多倍奖金',
          path: '/pages/mine/game/game',
        }, {
          title: '红包广场',
          content: '快来领取您团队内发送的红包吧！',
          path: '',
        }, {
          title: '幸运大转盘',
          content: '你当前有次抽奖机会',
          path: '/pages/mine/game/award',
        }, {
          title: '咨询中心',
          content: '及时查看内容消息',
          path: '',
        }, {
          title: '生活服务',
          content: '每日优选享受高品质的生活',
          path: '',
        }, {
          title: '数据中心',
          content: '平台公开市场/抢购/矿机数据',
          path: '',
        }],
        count:''
      }
    },
    onShow() {
      getTurntable().then((res) => {
        if (res.code == 1) {
          this.count = res.draw_num
          console.log('this.count=', this.count);
          this.list[3].content = `你当前有${this.count}次抽奖机会`
        }
      }).catch(err => {
        console.log('失败了');
      })
    },
    methods: {
      openUrl(url) {
        if (url) {
          this.$ui.push(url)
        }else {
          this.$ui.toast('暂未开放')
        }
      }
    }
  }
</script>

<style lang="less">
  .dapp {
    position: relative;
    margin-top: 20rpx;
    width: 100%;
    height: 158rpx;
    background: #FFFFFF;

    .image {
      position: absolute;
      top: 35rpx;
      left: 49rpx;
      width: 68rpx;
      height: 68rpx;
      background-color: #323232;
    }

    .title {
      position: absolute;
      top: 36rpx;
      left: 167rpx;
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #333333;
    }

    .content {
      position: absolute;
      top: 79rpx;
      left: 166rpx;
      font-size: 22rpx;
      font-family: PingFang SC;
      font-weight: 400;
      color: #999999;
    }

    .button {
      position: absolute;
      bottom: 48rpx;
      right: 59rpx;
      width: 100rpx;
      height: 42rpx;
      line-height: 42rpx;
      border: 2rpx solid #00B4FF;
      border-radius: 6rpx;
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 400;
      color: #00B4FF;
      text-align: center;
    }
  }
</style>
